<template>
  <div class="twoTitle">
    <img src="@/assets/img/common/twoTitle.png" />
    <span>{{ name }}</span>
    <p class="line"></p>
  </div>
</template>
  

<script>
export default {
  props: {
    name: {
      type: String,
      default: ''
    }
  }
}
</script>
<style lang="scss" scoped>
.twoTitle {
  display: flex;
  align-items: center;
  span {
    font-family: Source Han Sans CN;
    font-weight: 400;
    font-size: 1.5vh;
    color: #00ffff;
  }
  .line {
    width: 60%;
    height: 2px;
    background: #005566;
    margin-left: 20px;
    position: relative;
  }
  .line::after,
  .line::before {
    content: '';
    position: absolute;
    transform: translateY(-50%);
    width: 5px; /* 点的大小 */
    height: 5px; /* 点的大小 */
    background: radial-gradient(circle, #25d9da 50%, transparent 51%);
  }
  .line::before {
    left: 0; /* 根据需要调整位置 */
  }

  .line::after {
    right: 0; /* 根据需要调整位置 */
  }
}
</style>
  
  